/**
 * Created by levy on 16/7/18.
 * 这里的结构参考 order-list.js 与 order-confirm.js
 */
import {shopping} from "../const/shopping";
import {OrderUtil} from "../components/shopping/OrderUtil";
import Item from "../components/shopping/Item";
import AddressDetail from "../components/shopping/AddressDetail";

const lf = liefeng,
    R = React,
    RC = React.createClass,
    log = lf.utils.log,
    ajax = lf.utils.ajax;

const orderId = lf.utils.getUrlParam('orderId');

/**
 * props
 *  data
 */
const Root = RC({
    getInitialState() {
        return {
        }
    },
    componentWillMount() {
        
    },
    componentDidMount() {
        R.findDOMNode(this.refs.showMoreInfo).addEventListener('touchend', function () {
            $(this).toggleClass('active').prev().toggleClass('active');
        });
    },
    render() {
        let data = this.props.data,
            itemList = data.goodsList.map(function (item) {
                return <Item data={item} doAction="true"/>
            });

        return <div className="order-detail">
            <div className="row border-bottom">订单信息</div>
            <div className="order-info border-bottom">
                <div className="row">订单编号: <span className="text-gray">{data.orderSn}</span></div>
                <div className="row">订单金额: <span className="red">{'￥' + data.orderAmount}</span></div>
                <div className="row">订单状态: <span className="text-gray">{OrderUtil.getOrderStatus(data)}</span></div>
            </div>
            <div className="row border-bottom">商品信息</div>
            {itemList}
            <div className="more-info border-bottom">
                <div className="row border-bottom">收货信息</div>
                <AddressDetail data={data}/>
            </div>
            <div className="row show-more-info mui-navigate-right" ref="showMoreInfo"></div>
        </div>
    }
});

lf.appJs.getUser(function (user) {
    ajax({
        url: shopping.api.prefix + shopping.api.order.detail,
        data: {
            orderId: orderId,
        }
    }, null, (data) => {
        R.render(<Root user={user} data={data}/>, document.getElementById('root'));
    });
});